import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import 'normalize.css/normalize.css'
import '@/assets/css/base.css'
import pinia from '@/store/index'
import '@/utils/rem'
import lazyPlugin from 'vue3-lazy'
import Message from 'vue-m-message'
import 'vue-m-message/dist/style.css'
import 'animate.css/animate.min.css'
import 'element-plus/dist/index.css'
import exposure from '@/utils/observer'
const app = createApp(App)
app.use(pinia)
app.use(router)
app.use(lazyPlugin, {
  loading: require('@/assets/img/default-cover.jpg'), // 图片加载时默认图片
  error: require('@/assets/img/default-cover.jpg'), // 图片加载失败时默认图片
})
app.use(Message)
app.mount('#app')

// 自定义节流指令 防止多次重复点击 多次请求数据
app.directive('preventReClick', {
  mounted(el, binding) {
    el.addEventListener('click', () => {
      if (!el.disabled) {
        el.disabled = true
        setTimeout(() => {
          el.disabled = false
        }, binding.value || 1500)
      }
    })
  },
})

// 曝光 埋点
app.directive('track', {
  mounted(el, binding) {
    exposure.add({ el })
  },
})
